<template>
  <div class="mainWrap">
    <div class="top">
      <headerWrap></headerWrap>
      <navWrap></navWrap>
    </div>
    <listWrap></listWrap>
    <footerWrap></footerWrap>
  </div>
</template>

<script>
import headerWrap from "./headerWrap.vue";
import navWrap from "./navWrap.vue";
import listWrap from "./listWrap.vue";
import footerWrap from "./footerWrap.vue";
export default {
  name: "mainIndex",
  components: { headerWrap, navWrap, listWrap, footerWrap },
  data() {
    return {};
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.mainWrap {
  position: relative;
  padding-top: 198px;
}
.top {
  position: fixed;
  top: 0;
  left: 0;
  background: #fff;
}
</style>
